<!DOCTYPE html>
<html lang="es">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>BeeQuizz - Una nueva forma de evaluacion</title>
		<link rel="stylesheet" type="text/css" href="../bootstrap-3/dist/css/bootstrap.css">
		<link rel="stylesheet" type="text/css" href="../bootstrap-3/dist/css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap-responsive.css">
		<link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap-responsive.min.css">

		<link rel="stylesheet" type="text/css" href="../css/beequizz-mov.css">
		<link rel="stylesheet" type="text/css" href="../css/beequizz.css">
		
		<!-- JQuery -->
		<script src="../jquery/js/jquery-1.9.1.js"></script>
		<!-- UI JQuery -->
		<script src="../jquery/js/jquery-ui-1.10.3.custom.js"></script>
		<!-- Beequizz JS -->
		<script src="../jquery/js/beequizz.js"></script>
		<style>
		
		</style>
	</head>
	<body>
<!--  HEADER -->
		<header class="page-header" id="dv-cabecera"  >
			<div id="logo">				
				<img alt="logo Beequizz" class="img-responsive" src="../img/logoBeequizz-sm.jpg" width="70px" id="logo-lg" />
				<h2 style="float:left;"> BeeQuizz <br/> <small>Una nueva forma de evaluación</small></h2>
			</div>
			<div class="nuevoBloque"></div>							
		</header>
		<!-- MENU PRINCIPAL -->
		<div class="navbar navbar-default navbar-static-top" role="navigation" id="dv-menu-principal">
			<div class="container">		
				<div class="navbar-headers" >
		          <button data-target=".navbar-collapse" data-toggle="collapse" class="navbar-toggle collapsed" type="button">
		            <span class="sr-only">Toggle navigation</span>
		            <span class="icon-bar"></span>
		            <span class="icon-bar"></span>
		            <span class="icon-bar"></span>
		            <span class="icon-bar hidden-xs)"></span>
		          </button>
		          <a href="principal.html" class="navbar-brand"><img src="../img/icono-mov.png"" border="0" id="logo-xs" width="20px" /> BeeQuizz</a>
		        </div>
		        <div class="navbar-collapse collapse" style="height: 1px;" id="nav-main" >
			 		<ul class="nav navbar-nav">
					  <li class="active" id="primerNodo" ><a id="listaJuegos.html">Juegos</a></li>
					  <li><a id="miPerfil.html">Mi perfil</a></li>
					  <li><a id="gestionPreguntaRespuesta/gestionPreguntas.html">Agregar preguntas o respuestas</a></li>
					  <li><a id="estadisticas/estadisticas.html">Estadisticas</a></li>
					  <li class="visible-lg"><a id="administracion/administracion.html">Administracion</a></li>				
					</ul>   
	          		<div class="navbar-text navbar-right"><a href="../logout.html"  ><span class="glyphicon glyphicon-user"></span> Desconectarse</a></div>
		        </div><!--/.nav-collapse -->

			</div>
		</div>
		
		<!-- CONTENIDO -->
		<div id="contenedorTotal" >
			<div class="container-fluid">
			 	<div id="navSecundario" class="container-fluid">
					<h2 id="bienvenidos" class="text-center"> Bienvenidos a BeeQuizz</h2>		 	
				 </div> 

				
			</div> 
			<!-- <footer id="piePagina">
					<h4> Quienes somos y demas</h4>
			</footer>	 -->		
		</div>
		<script>
		/* $('#navSecundario').reload(); */
		
		$('ul li').click(function(event) {
			event.preventDefault(); // prevent link click if necessary?

			var $thisLi = $(this);
			var $ul = $thisLi.parent('ul');
		

			if (!$thisLi.hasClass('active')) {
				$ul.find('li.active').removeClass('active');
				$thisLi.addClass('active');
			} 
			
			 $("#navSecundario").load(event.target.id);
			 
			 
			 //Plegamos el menu principal
			 var navMain = $("#nav-main");
			 navMain.collapse("hide");
			 
			 
		}); 
							
		if (window.document.getElementById("navSecundario").innerHTML == " "){				
			window.document.getElementById("primerNodo").className="";				
		}
		</script>
		
				
		    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->  
<!--     <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
 -->    <script src="../bootstrap-3/dist/js/bootstrap.min.js"></script>
	</body>
</html>